/* 选人组件公共样式整理 begin */

.common-content {
  z-index: 1001;
  width: 100%;
  height: 100%;

  /* Start 头部标题 */
  .ant-modal-body {
    display: flex;
    flex-direction: column;
  }

  .popup-title {
    padding: 0 0 16px 0;
  }

  .popup-title h2 {
    margin-bottom: 0;
    font-size: 1.2em;
  }

  .search-bar {
    padding: 8px 8px 8px 16px;
  }

  .popup-title h4 {
    float: left;
    margin-bottom: 0;
    color: #999;
    font-weight: normal;
    font-size: 1em;
    line-height: 48px;
  }

  /* End 头部标题 */
  /* Start 弹窗 */
  .ant-modal-body {
    padding: 0;
    border-radius: 4px;
  }

  .ant-modal-title {
    color: @text-color;
    font-weight: bold;
    font-size: 18px;
  }

  /* End 弹窗 */
  .commonselect-container-box {
    overflow: hidden;
  }

  .popup-content {
    display: flex;
    justify-content: space-between;
    flex: 1 0 0;
    gap: 8px;
  }

  /* Start 左侧区域 */
  .container-left {
    // width: 100%;
    width: 1px;
    flex: 1 0 0;
    height: 100%;
    padding: 8px 8px 0 8px;
    border: 1px solid @border-color-split;
    border-radius: @border-radius-base;
    .search-box {
      display: flex;
      justify-content: space-between;
    }
    & > .ant-tree {
      height: calc(100% - 40px);

      .ant-tree-list-holder {
        overflow: hidden;
      }
    }
    .ant-spin-container .surely-table-body {
      flex: 1 1 0;
      max-height: initial !important;
    }

    .surely-table-cell-inner .surely-table-cell-content:not(.surely-table-cell-text-ellipsis) {
      display: flex;
      align-items: center;
      padding-left: 0;
    }

    .surely-table-body-cell {
      border: 0;
      background-color: transparent;
    }

    .surely-table-body-cell-range-selected:not(.surely-table-body .surely-table-body-cell-inline-edit) {
      background-color: transparent;
    }

    .ant-select {
      .ant-select-selector {
        border-radius: 2px 0 0 2px;
      }
    }

    .container-checkbox {
      height: calc(100% - 40px);

      &.table-wrapper {
        padding: 0;
      }

      .surely-table-wrapper {
        height: 100%;
        .ant-spin-nested-loading {
          height: 100%;
        }

        .surely-table {
          flex: 1;
          height: calc(100% - 32px);
        }
      }
    }
    .container-table {
      height: calc(100% - 42px);
      position: relative;
      .pagination-box {
        position: absolute;
        bottom: 10px;
        left: 7px;
        z-index: 11;
      }
      :deep(.surely-table-wrapper) {
        .surely-table-pagination {
          margin: 4px;
        }
      }
    }
    .ant-pagination {
      padding-right: 0;
      border: 0;
      padding-bottom: 0;
      justify-content: center;
      margin: 0px 0;
      .ant-pagination-options {
        margin-left: 0;
      }
    }
    // 表格分页样式
    .surely-table-wrapper {
      .ant-pagination-simple .ant-pagination-simple-pager input {
        width: 36px;
        border: 1px solid @layout-body-background;
      }

      .ant-pagination {
        position: relative;
        z-index: 11;
        display: flex;
        flex: 0 0 40px;
        float: initial;
        margin: 0;
        padding: 8px 36px 8px 0;
        font-size: @font-size-base;
        text-align: right;
        background: #fff;
        // border: 1px solid @table-border-color;
        border-top: 0;

        .ant-select:hover:has(.ant-select-selection-item) .ant-select-arrow {
          right: 12px;
        }

        .ant-pagination-total-text {
          margin-right: auto;
          margin-left: 8px;
        }

        .ant-pagination-prev,
        .ant-pagination-next,
        .ant-pagination-item:not(.ant-pagination-item-active),
        .ant-pagination-item:not(.ant-pagination-item-active) {
          background-color: @layout-body-background;
          border-color: @layout-body-background;
        }

        .ant-pagination-prev,
        .ant-pagination-next,
        .ant-pagination-prev .ant-pagination-item-link,
        .ant-pagination-next .ant-pagination-item-link {
          background-color: transparent;
          border-color: transparent;
        }

        .ant-pagination-item-link,
        .ant-pagination-item {
          // border: 0;
        }

        .ant-pagination-options-quick-jumper,
        .ant-pagination-total-text,
        .ant-select-selection__rendered {
          height: 24px;
          line-height: 22px;
        }

        .ant-pagination-options {
          .ant-select-selection--single {
            height: 24px;
            line-height: 24px;
            background-color: @layout-body-background;
            border-color: @layout-body-background;
          }

          .ant-pagination-options-quick-jumper input {
            height: 24px;
            line-height: 24px;
            background-color: @layout-body-background;
            border-color: @layout-body-background;
          }
        }

        .ant-pagination-prev,
        .ant-pagination-next,
        .ant-pagination-jump-prev,
        .ant-pagination-jump-next,
        .ant-pagination-item,
        .ant-select-selector,
        .ant-select-single:not(.ant-select-customize-input) .ant-select-selector .ant-select-selection-search-input,
        .ant-select-single .ant-select-selector .ant-select-selection-item,
        .ant-select-single .ant-select-selector .ant-select-selection-placeholder {
          min-width: 24px;
          height: 24px;
          margin: 0 2px;
          line-height: 22px;
          flex: none;
        }

        .ant-select-item-option-content {
          text-align: left;
        }

        .ant-pagination-item-active a {
          color: #fff;
          height: 100%;
          background: @primary-color;
        }

        .ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
          background-color: @layout-body-background;
          border-color: @layout-body-background;
        }
      }
    }
    .surely-table-cell {
      // border-bottom: 0;
      .user-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 24px;
        height: 24px;
        font-size: @font-size-base + 4px;
        margin-right: 4px;

        .svg-icon {
        }

        .ant-spin-nested-loading {
          height: 100%;
        }
      }

      .cell-txt {
        margin-right: 4px;
      }
    }

    .ant-tabs-nav-wrap {
      height: 40px;
      padding: 8px 8px 0 8px;
    }

    .ant-tabs-content-holder {
      flex: 1 0 0;
      padding: 8px 8px 0 8px;

      .ant-tabs-content {
        height: 100%;

        .ant-tree,
        .ant-tree-list,
        .ant-tree-list-holder {
          // height: 100%;
          overflow: hidden;
        }
      }
    }

    .ant-tabs-content-top .ant-spin-nested-loading {
      height: calc(100% - 40px);
    }
    .ant-spin-container {
      height: 100%;
      display: flex;
      flex-direction: column;
    }
    .ant-tree-title {
      .user-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 24px;
        height: 24px;
        font-size: @font-size-base + 4px;
        margin-right: 4px;

        .svg-icon {
        }
      }
    }

    // .ant-tree-show-line .ant-tree-switcher-line-icon {
    // vertical-align: -0.18em;
    // }
    .tree-icon {
      width: 20px;
      height: 20px;
      line-height: 20px;
      padding: 0px;
      text-align: center;
      font-size: @font-size-sm;
      color: #ffffff;
      border-radius: 50%;
    }
  }

  /* 左侧区域下拉及搜索 */

  .v-select {
    display: flex;
    margin-bottom: 8px;

    .ant-select {
      width: 220px;
    }

    .ant-input-search {
      margin-left: -1px;
    }

    .ant-input-affix-wrapper {
      height: 32px;

      &.ant-input-affix-wrapper:not(:last-child) {
        border-start-start-radius: 0;
        border-end-start-radius: 0;
      }
    }
  }

  .ant-select-selection {
    margin-right: -1px;
  }

  .only-search {
    float: none;
    width: 320px;
  }

  .container-left-spin {
    height: 90%;
    width: 100%;

    .ant-spin-dot {
      top: 50%;
    }
  }

  /* End 左侧区域 */
  /* Start 右侧区域 */
  .container-right {
    display: flex;
    flex-direction: column;
    // width: 49%;
    width: 1px;
    flex: 1 0 0;
    border-radius: @border-radius-base;
    border: 1px solid @border-color-split;

    .surely-table-body {
      position: initial;
      overflow-x: hidden;
    }

    .container-right-top {
      display: flex;
      align-items: center;
      height: 40px;
      padding-left: 12px;
      border-bottom: 1px solid @border-color-split;

      .anticon-delete {
        margin-right: 12px;
        margin-left: auto;
        color: @text-color-less;

        :hover {
          color: @error-color;
        }
      }
    }

    .checkgroup {
      position: relative;
      flex: 1 1 0;
      height: 1px;
      padding: 0;

      .surely-table-wrapper {
        height: 100%;
        .ant-spin-nested-loading {
          height: 100%;
        }

        .ant-spin-container {
          display: block;

          .surely-table {
            height: 100%;
          }

          .surely-table-cell {
            border: 0;

            .dept-select-title {
              flex: 1 0 0;
              overflow: hidden;
              white-space: nowrap;
              text-overflow: ellipsis;
              word-break: keep-all;
            }
          }

          .surely-table-drag-handle {
            margin: 0;
            color: @text-color-less;
            cursor: move;
          }

          // .surely-table-center-container{
          //   height: 400px!important;
          //   overflow: hidden;
          //   overflow-y: auto;
          // }
          .surely-table-cell-content {
            display: flex;
            align-items: flex-end;
            padding: 0 4px;

            .avic-icon {
              display: inline-flex;
              align-items: center;
              justify-content: center;
              margin-right: 4px;
              cursor: pointer;
              fill: @text-color-less;
              width: 20px;
              height: 20px;
              line-height: 20px;
              padding: 0px;
              font-size: @font-size-sm;
              color: #ffffff;
              border-radius: 50%;
              vertical-align: -0.125em;
            }

            .dept-icon {
              background-color: #4c72ff;
            }

            .checkclose {
              margin-left: auto;

              .avic-icon {
                font-size: 18px;
                color: #86909c;
              }

              :hover {
                fill: @error-color;
              }
            }
          }
        }
      }
    }
  }

  .dept-icon {
    background-color: #4c72ff;
  }

  .org-icon {
    background-color: #f4b010;
  }

  .group-icon,
  .role-icon,
  .position-icon {
    background-color: #51b3b4;
  }

  .users-icon {
    background-color: #66b5e7;
  }
}
